<template lang="">
    <div>
        <div class="title">添加学生信息</div>
        <el-form :model="infoForm" :rules="rules" ref="infoForm" label-width="100px">
            <el-form-item label="学生姓名" prop="stuName">
                <el-input v-model="infoForm.stuName"></el-input>
            </el-form-item>
            <el-form-item label="学生学号" prop="stuNum">
                <el-input v-model.number="infoForm.stuNum"></el-input>
            </el-form-item>
            <el-form-item label="学生专业" prop="stuProfessional">
                <el-input v-model="infoForm.stuProfessional"></el-input>
            </el-form-item>
            <el-form-item label="学生班级" prop="stuClass">
                <el-input v-model="infoForm.stuClass"></el-input>
            </el-form-item>
        </el-form>
        <el-button type="primary" round @click="emitServer('infoForm')">提交信息</el-button>
    </div>
</template>
<script>
    export default {
        name: 'AddInfo',
        data() {
            return {
                infoForm: {
                    stuName: '',
                    stuNum: '',
                    stuClass: '',
                    stuProfessional:''
                },
                rules: {
                    stuName: [{
                        required: true, message: '请输入姓名', trigger: 'blur'
                    }],
                    stuNum: [{
                        required: true, message: '请输入学号', trigger: 'blur'
                    },{
                        type:'number',message:'学号必须为数字'
                    }],
                    stuClass: [{
                        required: true, message: '请输入班级', trigger: 'blur'
                    }],
                    stuProfessional: [{
                        required: true, message: '请输入专业', trigger: 'blur'
                    }],
                }
            }
        },
        methods: {
            emitServer(infoForm) {

                this.$refs[infoForm].validate((valid) => {
                    if (valid) {
                        let form = this.infoForm
                        console.log('添加',form);
                        axios({
                            method: 'POST',
                            url: '/student/add',
                            withCredentials: true,
                            data: JSON.stringify(form),
                            headers: {
                                'Content-Type': 'application/json'
                            }
                        }).then((result) => {
                            if(result.data.code == '200'){
                                this.$message({
                                    message:`添加学生${form.stuNum}成功`,
                                    type:'success'
                                })
                            }else if(result.data.code == '101'){
                                this.$message({
                                    message:result.data.data,
                                    type:'error'
                                })
                            }
                        }).catch((err) => {
                            this.$message({
                                message:'添加失败'+err.message,
                                type:'info'
                            })
                        });


                    } else {
                        return false;
                    }
                });

            }
        },
    }
</script>
<style lang="">

</style>